import type { Metadata } from 'next'
import localFont from 'next/font/local'
import './globals.css'
import '@/styles/globals.scss'
import { ToastProvider } from '@/components/providers/toast-provider'
import { Toaster } from '@/components/ui/toaster'
import { AuthProvider } from '@/components/providers/auth-provider'
import { GlobalLoading } from '@/components/global-loading'
import { LayoutWrapper } from '@/components/providers/layout-provider'
import { I18nProvider } from '@/components/providers/i18n-provider'

const geistSans = localFont({
  src: './fonts/GeistVF.woff',
  variable: '--font-geist-sans',
  weight: '100 900',
})
const geistMono = localFont({
  src: './fonts/GeistMonoVF.woff',
  variable: '--font-geist-mono',
  weight: '100 900',
})

export const metadata: Metadata = {
  title: 'AIGC',
  description: 'AIGC',
}

const AkzidenzGroteskPro = localFont({
  variable: '--font-akzidenz-grotesk-pro',
  src: [
    {
      path: './fonts/AkzidenzGroteskPro-Light_Original.woff2',
      weight: '300',
    },
    {
      path: './fonts/AkzidenzGroteskPro-Regular_Original.woff2',
      weight: '400',
    },
    {
      path: './fonts/AkzidenzGroteskPro-Md_Original.woff2',
      weight: '500',
    },
    {
      path: './fonts/AkzidenzGroteskPro-Bold_Original.woff2',
      weight: '600',
    },
  ],
})

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode
}>) {
  return (
    <html lang="en">
      <body
        className={`${geistSans.variable} ${geistMono.variable} ${AkzidenzGroteskPro.variable} h-screen antialiased dark`}
      >
        <I18nProvider>
          <AuthProvider>
            <LayoutWrapper>{children}</LayoutWrapper>
            <ToastProvider />
            <Toaster />
            <GlobalLoading />
          </AuthProvider>
        </I18nProvider>
      </body>
    </html>
  )
}
